<template>
  <view class="container">
    <view class="typelist">
      <view>
        <uni-data-checkbox selected-color="#61BDB2" v-model="hobby" multiple :localdata="hobbys" />
      </view>
    </view>
    <view class="okbtn" @click="fnok">确定</view>
  </view>
</template>

<script>
import { category } from '@/services/shop.js';
export default {
  data() {
    return {
      hobby: [],
      hobbys: []
    };
  },
  onLoad() {
    this.getshoptype();
  },
  methods: {
    // 获取店铺分类
    async getshoptype() {
      const res = await category();
      console.log('店铺分类----', res);
      let lang = uni.getLocale();
      console.log(lang);
      res.result.data.forEach((item, index) => {
        if (lang == 'zh-Hans') {
          this.hobbys.push({
            value: JSON.parse(item.name).cn,
            text: JSON.parse(item.name).cn
          });
        } else if (lang == 'en') {
          this.hobbys.push({
            value: JSON.parse(item.name).en,
            text: JSON.parse(item.name).en
          });
        } else if (lang == 'ru') {
          this.hobbys.push({
            value: JSON.parse(item.name).ru,
            text: JSON.parse(item.name).ru
          });
        }
      });
      console.log(this.hobbys);
    },
    fnok() {
      console.log(this.hobby);
      uni.navigateTo({
        url: '/sub_my/myshop/myshop?type=' + this.hobby.join(',')
      });
    }
  }
};
</script>

<style lang="less" scoped>
.container {
  box-sizing: border-box;
  .typelist {
    box-sizing: border-box;
    width: 706rpx;
    height: 290rpx;
    background: #ffffff;
    border-radius: 20rpx 20rpx 20rpx 20rpx;
    margin: 20rpx 22rpx;
    .checklist-box {
      margin: 40rpx 120rpx 0 40rpx;
    }
  }
  .okbtn {
    position: absolute;
    bottom: 0;
    left: 60rpx;
    width: 640rpx;
    height: 100rpx;
    background: #61bdb2;
    text-align: center;
    line-height: 100rpx;
    color: #fff;
    border-radius: 50rpx 50rpx 50rpx 50rpx;
  }
}
</style>
